<template>
  <div>
    <el-button type="primary" @click="willadd">添加</el-button>

    <v-form :info="info"   @init="init" ref="form"></v-form>
    <v-list
      :arr="arr"
      @info="infoBian"
      
      @init="init"
      :pageSize="pageSize"
      :total="total"
      @changePage="changePage"
    ></v-list>
  </div>
</template>

<script>
import vList from "./components/list.vue";
import vForm from "./components/form.vue";
import {
  reqspecslist,
  reqspecsinfo,
  reqspecsdelete,
  reqspecscount,
} from "../../http/api";

export default {
  components: {
    vList,
    vForm,
  },
  data() {
    return {
      istree: true,
      info: {
        isshow: false,
        isAdd: true, //isAdd=true 添加   isAdd=false 编辑
      },
      //列表数据存放
      arr: [],
      pageSize: 2,
      total: 0,
      page: 1,
    };
  },
  mounted() {
    this.init();
    this.reqTotal();
  },

  methods: {
    willadd() {
      this.info.isshow = true;
      this.info.isAdd = true;
    },
    //请求总条数
    reqTotal() {
      reqspecscount().then((res) => {
        if (res.data.code == 200) {
          this.total = res.data.list[0].total;
        }
      });
    },
    //编辑
    infoBian(id) {
      console.log(id);
      this.info.isshow = true;
      this.info.isAdd = false;
      //通知form调用函数 发起请求
      this.$refs.form.getOne(id);
    },
    init() {
      //请求列表数据
      reqspecslist({ size: this.pageSize, page: this.page }).then((res) => {
        if (res.data.code == 200) {
          
          this.arr = res.data.list ? res.data.list : [];
          this.reqTotal();
        }

        if(this.arr==0&&this.page!=1){
          this.page--;
          this.init();
          return;
        }
      });
    },
    //修改page
    changePage(n) {
      this.page = n;
      this.init();
    },
    
  },
};
</script>

<style lang="less" scoped>
@import "../../less/index.less";

.el-button {
  margin: @padding10 !important;
}
</style>
